<!DOCTYPE html>
<html>
<head>
	<title>仓库信息</title>

	<meta name="keywords" content="keyword1,keyword2,keyword3">
	<meta name="description" content="this is my page">
	<meta name="content-type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" href="/static/plugin/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="/static/css/public.css" media="all" />
	<script type="text/javascript" src="/static/plugin/jquery/jquery-3.3.1.js"></script>
	<script type="text/javascript" src="/static/plugin/layui/layui.js"></script>
	<script type="text/javascript" src="/static/js/public.js"></script>
	<script type="text/javascript" src="/static/js/base.js"></script>
	<style type="text/css">
		.xing
		{
			color: red;
			float: left;
			display: block;
			width: 0.1%;
			margin-top:-25px;
			margin-left: 83%;
			font-size: 24px;
		}
	</style>
</head>
<script type="text/javascript"></script>
<body  class="layui-anim">
<div class="x-nav">
	    <span class="layui-breadcrumb">
	        <a href="">首页</a>
	        <a>
	            <cite>仓库信息</cite>
	        </a>
	    </span>
</div>
<div class="x-body">
	<div class="layui-row" style="margin-bottom: 18px">
		<form class="layui-form">
			<div class="layui-inline">
				<div class="layui-input-inline">
					<input type="text" id="keyword01" class="layui-input searchVal" placeholder="请输入仓库名称" />
				</div>
				<button type="button" class="layui-btn layui-btn-normal" data-type="reload"><i class="layui-icon layui-icon-search"></i>检索</button>
			</div>
		</form>
	</div>
	<div>
		<button class="layui-btn layui-btn-warm" id="add"><i class="layui-icon layui-icon-add-circle-fine"></i>新增</button>
		<button class="layui-btn layui-btn-danger" id="del"><i class="layui-icon layui-icon-delete"></i>批量删除</button>
	</div>
	<table class="layui-hide" id="tableList" lay-filter="tableList"></table>
	<script type="text/html" id="rowToolbar">
		<a class="layui-btn layui-btn-xs" lay-event="update"><i class="layui-icon layui-icon-edit"></i>编辑</a>
	</script>
</div>
<!-- 添加/编辑框 -->
<div id="addDivID" style="display:none">
	<form class="layui-form" id="addFormID" style="margin-top:20px">
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库名称</label>
				<input type = "hidden" id = "wid" name="wid">
				<input  class="layui-input" id="wname" name="wname" lay-verify="only" style="width: 213px;">
				<span class="xing" style="margin-left: 101%;">*</span>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库编号</label>
				<input  class="layui-input" id="wnumber" name="wnumber" lay-verify="only1" style="width: 213px;">
				<span class="xing" style="margin-left: 101%;">*</span>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库属性</label>
				<input  class="layui-input" id="wtype" name="wtype" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库地址</label>
				<input  class="layui-input" id="waddress" name="waddress" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库拥有者</label>
				<input  class="layui-input" id="wowner" name="wowner" lay-verify="request" style="width: 213px;">
				<span class="xing" style="margin-left: 101%;">*</span>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库管理员</label>
				<input  class="layui-input" id="wcreateMan" name="wcreateMan" lay-verify="request" style="width: 213px;">
				<span class="xing" style="margin-left: 101%;">*</span>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">创建时间</label>
				<input  class="layui-input" id="wcreateTime" name="wcreateTime" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">仓库负责人</label>
				<input  class="layui-input" id="wdutyMan" name="wdutyMan" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">负责人电话</label>
				<input  class="layui-input" id="wdutyManPhone" name="wdutyManPhone" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label">备注</label>
				<input  class="layui-input" id="wremark" name="wremark" style="width: 213px;">
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button class="layui-btn" id="subBtn" lay-submit lay-filter="addForm">立即提交</button>
				<button  class="layui-btn layui-btn-primary">取消</button>
			</div>
		</div>
		<script type="text/javascript">
			layui.use(['table','layer','upload','form','laydate'], function(){
				var table = layui.table;
				var layer = layui.layer;
				var form = layui.form;
				var laydate = layui.laydate;
				laydate.render({
					elem: '#wcreateTime',
					type: 'date',
					value:new Date()
				});
				var $ = layui.jquery, active = {
					reload:function () {
						var keyword01 = $("#keyword01").val();
						table.reload('contenttable',{
							method:'get',
							where:{"wname":keyword01}
							,page: {
								curr: 1//重新从第 1 页开始
							}
						});
					}
				}

				$('.layui-btn').on('click', function(){
					var type = $(this).data('type');
					active[type] ? active[type].call(this) : '';
				});
				table.render({
					elem: '#tableList'
					,url:'/warehouses/list'
					,title: '仓库信息'
					,id :'contenttable'
					,limits:[10,20,30]
					,toolbar: '#toolbar'
					,request: {   //如果无需自定义请求参数，可不加该参数
						pageName: 'page' //页码的参数名称，默认：page
						,limitName: 'pageSize' //每页数据量的参数名，默认：limit
					}
					,response: {   //如果无需自定义数据响应名称，可不加该参数
						countName: 'total' //规定数据总数的字段名称，默认：count
						,dataName: 'rows' //规定数据列表的字段名称，默认：data
					}
					,cols: [
						[
							{type: 'checkbox', fixed: 'left'}
							,{field:'wid', title:'序号', sort: true, type:'numbers', width: 60}
							,{field:'wcreateMan', title:'仓库管理员'}
							,{field:'wname', title:'仓库名称'}
							,{field:'wnumber', title:'仓库编号'}
							,{field:'wtype', title:'仓库属性'}
							,{field:'waddress', title:'仓库地址'}
							,{field:'wowner', title:'仓库拥有者'}
							,{field:'wdutyMan', title:'仓库负责人'}
							,{field:'wdutyManPhone', title:'负责人电话'}
							,{field:'wcreateTime', title:'创建时间'
								,templet: function(d){
									var value = d.wcreateTime;
									return formatTime(value,"yyyy-MM-dd HH:mm");
								},
							}
							,{field:'wremark', title:'备注'}
							,{fixed:'right',unresize: true, title:'操作', toolbar: '#rowToolbar',width:100, align: 'center'}
						]
					]
					,page: true
					,done : function(){
						$('th').css({
							'background-color': '#009688', 'color': '#fff','font-weight':'bold',
						})
					}
				});

				//监听复选框事件
				table.on('checkbox(tableList)',function(obj){
					if(obj.checked == true && obj.type == 'all'){
						//点击全选
						$('.layui-table-body table.layui-table tbody tr').addClass('layui-table-click');
					}else if(obj.checked == false && obj.type == 'all'){
						//点击全不选
						$('.layui-table-body table.layui-table tbody tr').removeClass('layui-table-click');
					}else if(obj.checked == true && obj.type == 'one'){
						//点击单行
						if(obj.checked == true){
							obj.tr.addClass('layui-table-click');
						}else{
							obj.tr.removeClass('layui-table-click');
						}
					}else if(obj.checked == false && obj.type == 'one'){
						//点击全选之后点击单行
						if(obj.tr.hasClass('layui-table-click')){
							obj.tr.removeClass('layui-table-click');
						}
					}
				})

				/**
				 * 表单校验
				 */
				form.verify({
					//value：表单的值、item：表单的DOM对象
					request: function(value, item){
						if(value == '' || value == null){
							return '不能为空';
						}
					},
					only: function(value, item){
						value = $.trim(value)
						if(value == '' || value == null){
							return '不能为空';
						}else{
							var wname = $.trim($("#wname").val())
							var flg = false;
							$.ajax({
								type:'post',
								data:'wname='+wname,
								url:'/warehouses/queryAllByMution',
								dataType: 'JSON',
								async: false,
								success:function (data) {
									if(data.length == 0){
										flg  = true;
									}else if(data.length == 1){
										var ma = $.trim($("#wid").val());
										if (ma == data[0].wid) {
											flg  = true;
										}else{
											flg = false;
										}
									}else{
										flg = false;
									}
								}
							});
							if(!flg){
								return '仓库名称不能重复';
							}
						}
					},
					only1: function(value, item){
						value = $.trim(value)
						if(value == '' || value == null){
							return '不能为空';
						}else{
							var wnumber = $.trim($("#wnumber").val())
							var flg = false;
							$.ajax({
								type:'post',
								data:'wnumber='+wnumber,
								url:'/warehouses/queryAllByMution',
								dataType: 'JSON',
								async: false,
								success:function (data) {
									if(data.length == 0){
										flg  = true;
									}else if(data.length == 1){
										var ma = $.trim($("#wid").val());
										if (ma == data[0].wid) {
											flg  = true;
										}else{
											flg = false;
										}
									}else{
										flg = false;
									}
								}
							});
							if(!flg){
								return '仓库编号不能重复';
							}
						}
					}
				});

				//新增
				$("#add").click(function(){
					layer.open({
						type: 1 					//Page层类型
						,area: ['450px', ''] 	//宽  高
						,title: '新增'
						,shade: 0.6 				//遮罩透明度
						,maxmin: true 				//允许全屏最小化
						,anim: 1 					//0-6的动画形式，-1不开启
						,content:$('#addDivID')
						,success: function(){
							$("#wid").val("")
							//初始化数据
							$("#addFormID").find('input[class=layui-input],select').each(function() {
								$(this).val('');
							});
							$("#wcreateTime").val(curentTime())
							form.render();
						}
					});
				});

				//编辑
				table.on('tool(tableList)', function(obj){
					var data = obj.data;
					if (obj.event === 'update') {
						layer.open({
							type: 1 					//Page层类型
							,area: ['450px', ''] 	//宽  高
							,title: '编辑'
							,shade: 0.6 				//遮罩透明度
							,maxmin: true 				//允许全屏最小化
							,anim: 1 					//0-6的动画形式，-1不开启
							,content:$('#addDivID')
							,success: function(){
								//数据回显
								for(var i=0;i<Object.entries(data).length;i++) {
									var id = '#' + Object.entries(data)[i][0];
									var text = Object.entries(data)[i][1];
									$(id).val(text);
								}
								form.render();
							}
						});
					}
				});

				//批量删除
				$("#del").click(function(){
					var rowData = table.checkStatus('contenttable');
					var data = rowData.data;
					var idArr = new Array();
					if(data.length == 0){
						layer.alert("请至少选择一条记录！",{icon :5});
					} else {
						var ids="";
						for(var i=0;i<data.length;i++){
							if(ids == ""){
								ids += data[i].wid;
							}else{
								ids += "," + data[i].wid;
							}
						}
						layer.confirm('确定删除吗？', function(){
							$.ajax({
								type:'post',
								url:'/warehouses/delete',
								data:{"ids" : ids},
								dataType:"json",
								success:function(data){
									if(data > 0){
										layer.msg("删除成功！",{icon:6});
										layer.closeAll();
										table.reload('contenttable',{
											method:'get',
											page: {
												curr: 1//重新从第 1 页开始
											}
										});
									}else{
										layer.msg("删除失败！",{icon:5});
										layer.closeAll();
										table.reload('contenttable',{
											method:'get',
											page: {
												curr: 1//重新从第 1 页开始
											}
										});
									}

								}
							});
						});
					}
				});

				/**
				 * 通用表单提交(AJAX方式)
				 */
				form.on('submit(addForm)', function () {
					var index = layer.msg('提交中，请稍候',{icon: 16,time:false,shade:0.8});
					var title = "新增";
					var url = '/warehouses/insert';
					var id = $.trim($("#wid").val());
					if(id != "" && id != null && id != 'undefined'){
						title = "编辑";
						url = '/warehouses/update';
					}
					$.ajax({
						type:'post',
						url:url,
						data:$("#addFormID").serialize(),
						cache:false,
						success:function(data){
							if (data > 0) {
								layer.closeAll();
                                layer.msg(title+'成功！',{icon:6});
								table.reload('contenttable',{
									method:'get',
									page: {
										curr: 1//重新从第 1 页开始
									}
								});
							} else {
								layer.msg('仓库名称或编号有重复,请重新输入！',{icon:5});
								layer.close(index);
							}
						}
					});
					return false;
				})
			});
			//获取当前时间
			function curentTime() {
				var now=new Date();
				var year = now.getFullYear();       //年
				var month = now.getMonth() + 1;     //月
				var day = now.getDate();            //日
				var time=year+"-"+add0(month)+"-"+add0(day);
				return time;
			}
			function add0(num) {
				if(num < 10){
					return "0"+num;
				}else{
					return num;
				}
			}
		</script>
	</form>
</div>
</body>
</html>
